<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>操作属性</title>
</head>
<body>
<form action="#" method="get">
    姓名 <input type="text" name="username" id="username" value="德玛西亚"/> <br/>

    爱好
    <input type="checkbox" name="hobby" value="smoke">抽烟
    <input type="checkbox" name="hobby" value="drink">喝酒
    <input type="checkbox" name="hobby" value="perm">烫头<br/>

    <input type="reset" value="清空按钮"/>
    <input type="submit" value="提交按钮"/><br/>
</form>

<script>
    // 1.获取文本框预定义的属性值
    //所有属性都可以获取
    let username = document.getElementById("username");
    console.log(username.value);
    console.log(username.type);
    console.log(username.id);
    //赋值
    username.value = "做核酸。。。";

    //找到所有的hobby标签，然后把所有状态设置为true
    let ele = document.querySelectorAll("input[name='hobby']");
    for (element of ele) {
        element.checked = true; //true为选中。
    }


    // 2.给文本框设置自定义属性（了解）

    // 3.获取文本框自定义属性（了解）

    // 4.移出文本框自定义属性（了解）


</script>
</body>
</html>